<template>
  <div class="item-box relative flex">
    <div class="flex flex-1 items-center text-[14px]">
      <span
        v-if="hasDot"
        class="mr-2 inline-block h-[8px] w-[8px] rounded bg-[#FF6868]"
      ></span>
      <span>{{ label }}</span>
    </div>
    <div
      v-if="value"
      class="flex flex-1 items-center justify-between text-[14px]"
    >
      {{ value }}
    </div>
  </div>
</template>

<script setup lang="tsx">
defineProps({
  hasDot: {
    type: Boolean,
    default: true,
  },
  label: {
    type: String,
    default: '',
  },
  value: {
    type: [String, Number],
    default: '',
  },
});
</script>

<style lang="scss" scoped></style>
